<template>
  <div id="app">
    <G6Editor mode="edit" :height="clientHeight"   :data="data"></G6Editor>
  </div>
</template>

<script>
import G6Editor from './components/G6Editor'

export default {
  name: 'App',
  components: {
    G6Editor
  },
  data() {
    return {
      clientHeight: document.documentElement.clientHeight,
      data: {
        nodes: [{
          id: 'node1',
          x: 100,
          y: 200
        }, {
          id: 'node2',
          x: 300,
          y: 200
        }],
        edges: [{
          id: 'edge1',
          target: 'node2',
          source: 'node1'
        }]
      }
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      console.log('init')
      console.log(this.clientHeight)
    }
  }
}
</script>

<style>
html,
body {
  overflow: hidden;
  margin: 0;
  font-size: 12px;
}

#app {
  margin: 0;
  padding: 0;
}
</style>
